<template>
	<view>
		<view class="plr40 content">
			<view class="ft24 mt10 bold">注册（{{step}}/2）</view>
			<view class="mt50">
				<view class="bgInput radius10 plr20 align-center align-between">
					<text>姓名*</text>
					<input type="text" class="h55 flex1 tr" placeholder="输入手机号码" placeholder-class="placeholderStyle" />
				</view>
				<view class="bgInput radius10 plr20 align-center justify-between mt20">
					<text>性别*</text>
					<view class="align-center">
						<view class="bggray radius8 tc white sexitem ml10" :class="{'bgBlue':sex==index+1}" 
						v-for="(item,index) in 2" :key="index" @click="setSex(index)">
							<text>{{index==0 ? '男':'女'}}</text>
						</view>
					</view>
				</view>
				<view class="bgInput radius10 plr20 align-center justify-between mt20">
					<text>所在地区*</text>
					<view class="align-center h55">
						<text>河南省</text>
						<text class="ml5">郑州市</text>
						<text class="ml5">金水区</text>
						<view class="ml5">
							<uv-icon name="arrow-right" color="#999999" size="12"></uv-icon>
						</view>
					</view>
				</view>
				<view class="bgInput radius10 plr20 align-center align-between mt20">
					<text>所在医疗机构*</text>
					<input type="text" class="h55 flex1 tr" placeholder="请填写医疗机构" placeholder-class="placeholderStyle" />
				</view>
				<view class="bgInput radius10 plr20 align-center align-between mt20">
					<text>职务*</text>
					<input type="text" class="h55 flex1 tr" placeholder="请填写职务" placeholder-class="placeholderStyle" />
				</view>
			</view>
		</view>
		<view class="posFixed w100 btm0 plr40 ">
			<view class="ptb15">
				<mix-button ref="confirmBtn" text="下一步" marginTop="0" @onConfirm="next" v-if="step==1"></mix-button>
				<mix-button ref="confirmBtn" text="登录" marginTop="0" @onConfirm="login" v-else></mix-button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				step:1,
				sex:1
			}
		},
		methods: {
			next(){
				this.step = 2
			},
			setSex(index){
				this.sex = index+1
			},
			login(){
				this.navTo('/pages/docInfo/issue')
			}
		}
	}
</script>

<style lang="scss">
page{
	background-color: #ffffff;
}
.content{
	padding-top: 30upx;
	.sexitem{
		width: 52upx;
		height: 52upx;
		line-height: 52upx;
	}
}
</style>
